﻿@namespace BlazorFluentUI
@inherits FluentUIComponentBase

<div role="tablist" aria-label=@AriaLabel style="overflow:hidden;">
    <FocusZone Direction=FocusZoneDirection.Horizontal>
        <CascadingValue Name="Pivot" Value="@this">
            <div class=@($"ms-Pivot mediumFont{(LinkFormat == PivotLinkFormat.Tabs ? " ms-Pivot--tabs" : "")}{(LinkSize == PivotLinkSize.Large ? " ms-Pivot--large" : "")}")>
                @ChildContent
            </div>
        </CascadingValue>
    </FocusZone>

    @if (!HeadersOnly && !(Selected == null) && PivotItems!.IndexOf(Selected) == _oldIndex)
    {
        <div role="tabpanel">
            @_oldChildContent
        </div>
    }
    else if (!HeadersOnly && !(Selected == null) && !_redraw)
    {
        <div role="tabpanel" class="@($"{(PivotItems!.IndexOf(Selected) > _oldIndex ? "slideLeftIn40" : "slideRightIn40")}")">
            @Selected.ChildContent
        </div>
    }
    else if (!HeadersOnly && !(Selected == null) && _redraw)
    {
        @*
            Is needed for itemContent animation
        *@
        <div role="tabpanel">
            @_oldChildContent
        </div>
    }
</div>
